<template>
  <div class="container">
    <scroll-view scroll-y
                 style="height:100%">
      <img v-if="img_baseurl"
           :src="img_baseurl+'/mp_3.0.2/bg_referral@2x.png'"
           mode="widthFix"
           alt />
      <div class="card">
        <img v-if="img_baseurl"
             :src="img_baseurl+'/mp_3.0.2/bg_referral_white@2x.png'"
             mode="widthFix"
             alt />
        <div class="text">
          <div class="top">
            <p class="tit">您的推荐码</p>
            <p class="num">{{super_code}}</p>
            <p class="copy"
               @click="copyText">复制</p>
          </div>
          <div class="bottom">

            <img v-if=" imgurl"
                 :src="imgurl"
                 mode="widthFix"
                 alt />
          </div>
        </div>
      </div>
    </scroll-view>
  </div>
</template>
<script>
import common from "@/assets/js/mmk_common.js";
export default {
  data () {
    return {
      img_baseurl: common.image_resource,
      super_code: "",
      imgurl: ""
    };
  },
  methods: {
    imgfun () {
      wx.showLoading({
        title: "加载中", //提示的内容,
        mask: true //显示透明蒙层，防止触摸穿透,
      });
      /**获取二维码 */
      common.fly_post(
        "api/v4_5/super_code/generate",
        {
          super_code: this.super_code
        },
        result => {
          console.log(result);
          let res = result.data;
          wx.hideLoading();
          if (res.status_code == 0) {
            this.imgurl = res.data.qrcode;
          }
        }
      );
    },
    copyText () {
      console.log(this.super_code);
      wx.setClipboardData({
        data: this.super_code,
        success: function (res) {
          wx.getClipboardData({
            success: function (res) {
              wx.showToast({
                title: "复制成功"
              });
            }
          });
        }
      });
    }
  },

  onLoad (options) {
    wx.setNavigationBarTitle({
      title: "我的推荐码"
    });
    console.log(options);
    this.super_code = options.super_code;
    this.imgurl = wx.getStorageSync("codeimg");
  }
  // onShow() {
  //   this.imgfun();
  // }
};
</script>

<style scoped lang="less">
.container {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  background-color: #f3f4f6;
  img {
    width: 100%;
    height: auto;
  }
  .card {
    position: absolute;
    width: 80%;
    height: 424px;
    top: 28%;
    left: 50%;
    margin-left: -40%;
  }
  .text {
    position: absolute;
    top: 0;
    width: 100%;
    height: auto;
  }
  .bottom {
    display: flex;
    align-items: center;
    justify-content: center;
    img {
      width: 207px;
      height: 207px;
    }
  }
  .top {
    text-align: center;
    .tit {
      font-size: 16px;
      color: #333;
      margin-top: 25px;
      margin-bottom: 5px;
    }
    .num {
      color: #6a3257;
      font-size: 26px;
      margin-bottom: 13px;
      font-weight: 700;
    }
    .copy {
      border-radius: 5px;
      width: 75px;
      height: 24px;
      line-height: 24px;
      background: #f3f4f6;
      color: #666666;
      font-size: 14px;
      margin: auto;
      margin-bottom: 43px;
    }
  }
}
</style>

